const path = require('path'),
      w    = require('webpack');

module.exports = {
    entry:{
        idx: './src/idx.js'
    },
    output: {
        path: path.resolve(__dirname, './dist/'),
        filename: '[name].m.js',
        publicPath: './dist/'
    },
    module: {
        rules: [
	{
	    test: /\.css$/,
	    use: [{
		loader: 'style-loader'
	    },{
		loader: 'css-loader'
	    },{
		loader: 'postcss-loader',
		options: {
		    ident: 'postcss',
		    plugins: [
			// 默认雪碧图生成到了根目录上sprite放在根上 hash的放在dist里面,默认的位置不对如果指定输出位置？
			require('postcss-sprites')(
			// 如果想指定输出，需要在这里配置配置文件,这个只是控制sprite.png 的输出。
			{
			    // 为什么会生成两张图片 sprite.png 是原图，哈希的那个是压缩后的被imgloader搞过的
			    spritePath: './dist/assets',
			    // 高清设备 2倍大小图标图和生成雪碧图？ 需要告诉postcss哪些图片是retina屏幕的。图片要做标识，图片名@2x.png 但是css引用需改变。
			    retina: true		    
			})
		    ]
		}
	    }]
        },
        {
            test: /\.(png|gif|jpg|jpeg)$/,
            use: [{
                loader: 'file-loader',
                options: {
		    publicPath: '/dist/assets/',
		    outputPath: '../',
		    useRelativePath: true
		}
            },{
                // 默认情况下，没有任何配置压缩没有效果。                 
                loader: 'img-loader',
                options: {
                    plugins: [
                        // 针对png的压缩
                        require('imagemin-pngquant')({
                            floyd: 0.5,
                             speed: 2
                         })
                    ]
                }
            }]
        }

        ]
    }
}
